/**
 * Created by tanjian on 2017/4/14.
 */
const path = require('path');
const webpack = require('webpack');
const ExtractTextPlugin = require("extract-text-webpack-plugin"); //额外安装的wepback关于css分离打包的插件。
const ParallelUglifyPlugin = require('webpack-parallel-uglify-plugin'); //额外安装的webpack关于生产环境配置的压缩js文件的插件
const os = require('os'); //压缩js插件的配置模块
const CommonsChunkPlugin = webpack.optimize.CommonsChunkPlugin;
const HtmlWebpackPlugin = require('html-webpack-plugin'); //热加载模块
//postcss插件配置项
const autoprefixer = require('autoprefixer');
const postcssOpts = {
    ident: 'postcss', // https://webpack.js.org/guides/migrating/#complex-options
    plugins: () => [
        autoprefixer({
            browsers: ['last 2 versions', 'Firefox ESR', '> 1%', "ie >= 9","Firefox >= 20","Chrome >= 48","Safari >= 8"],
        }),
        // pxtorem({ rootValue: 100, propWhiteList: [] })
    ],
};
module.exports = {
    entry: {
        index: path.resolve(__dirname, './src/component/indexRoute.js'),
        login: path.resolve(__dirname, './src/component/loginRoute.js'),
        expressBill: path.resolve(__dirname, './src/component/expressBillRoute.js'),
        shared: ['react', 'react-dom', 'react-router', 'jquery', 'moment'],
        vendor: ['react', 'react-dom']
    },
    output: {
        path: path.resolve(__dirname, './dist/js'),
        publicPath: '/', // 输出解析文件的目录，url 相对于 HTML 页面
        filename: '[name].bundle.js'
    },
    resolve: {
        modules: [path.resolve(__dirname, 'node_modules'), path.join(__dirname, 'src')],
        extensions: ['.web.js', '.mjs', '.js', '.json', '.web.jsx', '.jsx'],
    },
    module: {
        loaders: [
            {
                test: /\.(jsx|js)$/,
                exclude: /node_modules/,
                loader: "babel-loader",
                query:
                {
                    presets: ['es2015', 'react'],
                    plugins: [
                        ['import', { libraryName: 'antd', style: 'css' }],
                    ]
                }
            }, {
                test: /\.scss$/,
                loaders: ['style', 'css', 'sass'],
                include: path.resolve(path.resolve(path.resolve(__dirname), 'build'), 'app')
            }, {
                test: /\.(png|jpg|gif)$/,
                loader: 'url-loader?limit=1024000'
            },
            // {
            //     test: /\.css$/,
            //     loader: "style-loader!css-loader"
            //     // loader: ExtractTextPlugin.extract({
            //     //     fallbackLoader: 'style-loader',
            //     //     loader: 'css-loader',
            //     // })
            // }
            {
                test: /\.css$/,
                use: ExtractTextPlugin.extract({
                    fallback: "style-loader",
                    use: "css-loader"
                })
            },
            {
                test: /\.less$/i, use: ExtractTextPlugin.extract({
                    fallback: 'style-loader',
                    use: ['css-loader', { loader: 'postcss-loader', options: postcssOpts }, 'less-loader']
                })
            },
            {
                test: /\.(eot|ttf|svg|woff|woff2)$/,
                loader: 'file-loader?name=fonts/[name].[ext]',
            }
        ]
    },
    devServer: {
        hot: true,
        inline: true,
        port: 3000
    },
    plugins: [
        new webpack.optimize.CommonsChunkPlugin({name:'vendor', filename: 'vendor.js'}),
        new webpack.NoEmitOnErrorsPlugin(), 
        // 热加载配置------------
        new HtmlWebpackPlugin({
            template: './index.html'
        }),
        new webpack.HotModuleReplacementPlugin(),
        //----------------------
        new webpack.optimize.OccurrenceOrderPlugin(),
        //css分离打包插件，分离出每个入口文件相应的CSS然后从html引入
        new ExtractTextPlugin({filename: '[name].css', allChunks: true }),
        new CommonsChunkPlugin({
            name: 'shared',
            minChunks: Infinity
        }),
        //开发时使用下文的压缩插件，不会屏蔽console
        new webpack.optimize.UglifyJsPlugin({
            compress: {
                warnings: false
            },
            output: {
                comments: false, // remove all comments
            },
            warnings: false,
        }),
        //生产环境压缩插件，开发时请注释，会自动屏蔽console
        // new ParallelUglifyPlugin({
        //     workerCount: os.cpus().length,
        //     //cacheDir: '.cache/',
        //     uglifyJS: {
        //         compress: {
        //             warnings: false,
        //             drop_debugger: true,
        //             drop_console: true
        //         },
        //         output: {
        //             comments: false,
        //             //sourceMap: true,
        //         },
        //         mangle: true
        //     }
        // }),
        //内置插件，配置环境变量，用于生产环境配置打包。
        new webpack.DefinePlugin({
            'process.env': {
                NODE_ENV: JSON.stringify(process.env.NODE_ENV),
            },
        }),
    ]
};